<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ajax</title>
</head>
<body>
<button id="btn" onclick="send()">发送</button>
<script src="../static/js/jquery.js"></script>
<script>
    let btn = document.querySelector("#btn")
    // 获取html元素 $('选择器')
    // let btn = $("#btn")
    // btn.onclick = () => {
    //     console.log("click")
    //     // $.get(url,[data],[function]) xhr.responseText --> data
    //     $.get("http://localhost:8080/get", function (data) {
    //         console.log(data)
    //     }, "json")
    // }
    //
    // get(url, function(data){})
    // function(data){} --> 执行时间：响应结束 将响应的内容封装到 data 中
    // 使用默认的 XMLHttpRequest 发送请求
    // let xhr = new XMLHttpRequest()
    // xhr.open("get", "http://localhost:8080/get", true)
    // xhr.send()
    // xhr.onreadystatechange = () => {
    //     // TODO 处理发送成功业务
    //         xhr.responseText
    // }
    // $.get("http://localhost:8080/get", function(data){
    //     console.log(data.code)
    // })
    // post(url, [data],[callback])
    function send() {
        // $.post("http://localhost:8080/test", {
        //     name: "鼠标",
        //     price : "9999"
        // },function (resp) { // resp -- 服务端返回的 Result
        //     console.log(resp)
        // })
        // $.ajax({url, type, data, complete, success, error})
        $.ajax({
            url: 'http://localhost:8080/test',
            type: 'POST',
            data: {
                name: "键盘",
                price : "999"
            },
            complete: (xhr, status) => { // 只要请求完成就会执行
                console.log(xhr)
            },
            success: (resp) => { // 请求成功执行该函数
                console.log(resp)
            },
            error: (error) => { // 请求失败执行
                console.log(error)
            },
            dataType: "text",
        })
    }


</script>
</body>
</html>